﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <link href="~/css/shop.css" type="text/css" rel="stylesheet" />
    <link href="~/css/Sellerber.css" type="text/css" rel="stylesheet" />
    <link href="~/css/bkg_ui.css" type="text/css" rel="stylesheet" />
    <link href="~/font/css/font-awesome.min.css" rel="stylesheet" type="text/css" />

    <link rel="stylesheet" href="~/layui/css/layui.css" />

    <script src="~/Scripts/jquery-3.3.1.js"></script>
    <script src="~/layui/layui.js" type="text/javascript"></script>
    <script src="~/layui/time.js"></script>

    <title>会员管理</title>
</head>
<body>
    <div class="margin" id="page_style">
        <div class="operation clearfix same_module mb15">
            <ul class="choice_search">
                <li class="clearfix col-xs-2 col-lg-2 col-ms-3 "><label class="label_name ">会员名称：</label><input id="names" class="form-control col-xs-6 col-lg-5" /></li>

            </ul>
            <button class="btn button_btn bg-deep-blue " onclick="" id="select" type="button"><i class="fa  fa-search"></i>&nbsp;搜索</button>
        </div>
        <div class="h_products_list clearfix" id="Sellerber">

            <div class="article_sort_list">
                <table class="layui-hide" id="test" lay-filter="demo"></table>
                <script type="text/html" id="barDemo">
                    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
                    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
                </script>
            </div>

        </div>
    </div>
    <!--修改用户图层-->
    <div class="add_menber" id="add_menber_style" style="display:none">

        <ul class=" page-content">
            <li><label class="label_name">用&nbsp;&nbsp;户 &nbsp;名：</label><span class="add_name"><input id="UserName" name="用户名" type="text" class="text_add" /></span><div class="prompt r_f"></div></li>
            <li><label class="label_name">真实姓名：</label><span class="add_name"><input name="真实姓名" type="text" id="RealName" class="text_add" /></span><div class="prompt r_f"></div></li>
            <li><label class="label_name">性&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;别：</label><span class="add_name"><input id="UserSex" type="text" class="text_add" /></span></li>
            <li><label class="label_name">电话号码：</label><span class="add_name"><input name="固定电话" id="Phone" type="text" class="text_add" /></span><div class="prompt r_f"></div>
            </li>
            <li><button class="btn button_btn bg-deep-blue" id="update">修改</button></li>
        </ul>

    </div>

</body>
</html>

<script>
    layui.use('table', function () {
            var table = layui.table,
                form = layui.form;
                table.render({
                    elem: '#test'
                    , url: '/Member/Display'
                    //,toolbar: '#toolbarDemo'
                    , cellMinWidth: 80
                    , cols: [[
                          { field: 'Id', width: 117, title: 'ID' }
                        , { field: 'RealName', width: 135, title: '管理员姓名' }
                        , { field: 'UserName', width: 170, title: '管理员登录名' }
                        , { field: 'UserSex', title: '性别', width: 128.5}
                        , { field: 'Phone', width: 170, title: '电话号码' }
                        , { field: 'CreateTime', title: '创建时间', width: 170, sort: true, templet: "<div>{{Format(d.CreateTime,'yyyy-MM-dd hh:mm:ss')}}</div>" }
                        , { field: 'Status', title: '是否启用', width: 120, templet: '#switchTpl', unresize: true }
                        //, { field: 'CreateAdminName', width: 170, title: '' }
                        , { fixed: 'right',title: '操作' ,width: 200, align: 'center', toolbar: '#barDemo' }
                    ]]
                    , page: true
                    , id:'testReload'
                });

            table.on('tool(demo)', function (obj) {
                var data = obj.data;
                if (obj.event == 'del') {
                    //删除
                     layer.confirm('真的要删除吗?', function (index) {
                             $.ajax({
                                url: "/Member/Delete?ID="+ data.Id,
                                type: "Post",
                                success: function (data) {
                                    if (data.Success) {
                                        layer.msg('删除成功！', {
                                            title: '提示框',
                                            icon: 1,
                                            time: 2000
                                        }, function () {
                                            location.reload();//刷新当前页面
                                        });
                                    }
                                    else {
                                        layer.msg('删除失败！', {
                                            title: '提示框',
                                            icon: 1,
                                            time: 2000
                                        });
                                    }
                                }
                             });
                         });
                }
                else if (obj.event == 'edit') {
                    $("#UserName").val(data.UserName);
                    $("#RealName").val(data.RealName);
                    $("#UserSex").val(data.UserSex);
                    $("#Phone").val(data.Phone);
                    layer.open({
                        type: 1,
                        title: '修改管理员信息',
                        area: ['700px', ''],
                        shadeClose: false,
                        content: $('#add_menber_style'),
                    });
                    $("#update").click(function () {
                        var user = {};
                        user.Id = data.Id;
                        user.UserName = $("#UserName").val();
                        user.RealName = $("#RealName").val();
                        user.UserSex = $("#UserSex").val();
                        user.Phone = $("#Phone").val();
                        $.ajax({
                            data: user,
                            url: "/Member/UpdateUser",
                            type: "Post",
                            success: function (data) {
                                if (data.Success) {
                                    layer.msg('修改成功！', {
                                        title: '提示框',
                                        icon: 1,
                                        time: 2000
                                    }, function () {
                                        location.reload();//刷新当前页面
                                    });
                                }
                                else {
                                    layer.msg('修改过程中出现异常！', {
                                        title: '提示框',
                                        icon: 1,
                                        time: 2000
                                    });
                                }
                            }
                        });
                    });
                }
            });

            //监听启用和禁用操作
            form.on('switch(sexDemo)', function (obj) {
                var tip = "启用";
                var id = this.id;
                var tap = true;
                //layer.tips(this.id + ' ' + this.value + '：' + obj.elem , obj.othis);
                if (this.value === "1") {
                    tip = "禁用";
                    tap = 0;
                }
                else {
                    tip = "启用";
                    tap = 1;
                }
                //启用的功能代码
                layer.confirm('真的要' + tip + '吗', function (index) {
                    $.ajax({
                        url: "/Member/Enable?ID=" + id + "&status=" + tap,
                        type: "Post",
                        success: function (data) {
                            if (data.Success) {
                                layer.msg(tip+'成功！', {
                                    title: '提示框',
                                    icon: 1,
                                    time: 2000
                                }, function () {
                                    location.reload();//刷新当前页面
                                });
                            }
                            else {
                                layer.msg(tip +'失败！', {
                                    title: '提示框',
                                    icon: 1,
                                    time: 2000
                                });
                            }
                        }
                    });
                });
            });

    });

        $("#select").click(function () {
            TableReload();
        });

    function TableReload() {
            var table = layui.table;
            //获取页面管理员名称和时间
            var LoginName = $("#names").val();
            var Time = $("#start").val();
            //上述方法等价于
            table.reload('testReload', {
                where: { //设定异步数据接口的额外参数，任意设
                    LoginName: LoginName,
                    Time: Time
                    //…
                }
            });
    };
</script>
<script type="text/html" id="switchTpl">
    <input type="checkbox" id="{{d.Id}}" name="Status" value="{{d.Status}}" lay-skin="switch" lay-text="启用|禁用" lay-filter="sexDemo" {{ d.Status == '1' ? 'checked' : ' ' }}={{ d.Status == '1' ? 'checked' : ' ' }} />
</script>

@*<li class="clearfix col-xs-4 col-lg-5 col-ms-5 ">
        <label class="label_name ">注册时间：</label>
        <input class="laydate-icon col-xs-4 col-lg-3" id="start" style=" margin-right:10px; height:28px; line-height:28px; float:left" />
    </li>*@